<!DOCTYPE html>
<html lang="zh">
    <head>
        <meta charset="utf-8">
        <title>登录 - 喜秒后台管理系统</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="description" content="">
        <meta name="author" content="">

        <!-- Bootstrap core CSS -->
        <link href="/bootstrap/css/bootstrap.css" rel="stylesheet"/>
        <!-- Font Awesome -->
        <link href="/font-awesome/css/font-awesome.css" rel="stylesheet"/>   
        <!-- Endless -->
        <link href="/admin/css/layout.css" rel="stylesheet">

    </head>

    <body>
        <div class="login-wrapper">
            <div class="text-center">
                <h2 class="fadeInUp animation-delay8" style="font-weight:bold">
                    <span class="text-success">喜秒</span> <span style="color:#ccc; text-shadow:0 1px #fff">后台管理系统</span>
                </h2>
            </div>
            <div class="login-widget animation-delay1">	
                <div class="panel panel-default">
                    <div class="panel-heading clearfix">
                        <div class="pull-left">
                            <i class="fa fa-lock fa-lg"></i> 登录
                        </div>
                    </div>
                    <div class="panel-body">
                        <form class="form-login" id="form" onsubmit="login();return false;">
                            <div class="form-group">
                                <label>用户名</label>
                                <input type="text" placeholder="请输入用户名" name="username" class="form-control input-sm bounceIn animation-delay2" autocomplete="off" data-required="true" data-rangelength="[1,50]">
                            </div>
                            <div class="form-group">
                                <label>密码</label>
                                <input type="password" placeholder="请输入密码" name="password" class="form-control input-sm bounceIn animation-delay4" autocomplete="off" data-required="true">
                            </div>
                            <div class="form-group">
                                <label class="label-checkbox inline">
                                    <input type="checkbox" value="1" name="remember" class="regular-checkbox chk-delete" />
                                    <span class="custom-checkbox info bounceIn animation-delay4" style="margin-bottom: 3px;">记住密码</span>
                                </label>
                                <div class="text-center pull-right" style="margin-right: 20px;">
                                    <sapn style="color: red;font-size: 12px;" id="errotInfo"></sapn>
                                </div>
                            </div>
                            <hr/>
                            <button type="submit" class="btn btn-success btn-sm bounceIn animation-delay5 pull-right"><i class="fa fa-sign-in"></i> 登录</button>
                        </form>
                    </div>
                </div><!-- /panel -->
            </div><!-- /login-widget -->
        </div><!-- /login-wrapper -->

        <!-- Le javascript
        ================================================== -->
        <!-- Placed at the end of the document so the pages load faster -->

        <!-- Jquery -->
        <script src="/jquery/jquery-3.2.1.js"></script>

        <!-- Bootstrap -->
        <script src="/bootstrap/js/bootstrap.min.js"></script>

        <!-- Cookie -->
        <script src='/admin/js/jquery.cookie.min.js'></script>

        <!-- Modernizr -->
        <script src='/admin/js/modernizr.min.js'></script>

        <!-- Popup Overlay -->
        <script src='/admin/js/jquery.popupoverlay.js'></script>

        <!-- Parsley js验证库-->
        <script src="/admin/js/parsley.min.js"></script>

        <!-- Endless -->
        <script src="/admin/js/endless.js"></script>
        <script>
            function login() {
                try {
                    var validate = $('#form').parsley();
                    if (!validate.validate()) {
                        return false;
                    }
                    jQuery.ajax({
                        url: '/login',
                        data: $('#form').serialize(),
                        type: "POST",
                        async: false,
                        beforeSend: function () {
                            $('#errotInfo').html('信息传输中...');
                        },
                        success: function (returnData) {
                            var data = JSON.parse(returnData);
                            if (data.status + '' === '0') {
                                $('#errotInfo').html('登陆成功，正在跳转...');
                                window.location = "/";
                            } else {
                                $('#errotInfo').html(data.msg);
                            }
                        },
                        error: function () {
                            $('#errotInfo').html('网络连接失败');
                        }
                    });
                } catch (e) {
                    $('#errotInfo').html('本系统暂不支持此浏览器！');
                }
                return false;
            }
        </script>
    </body>
</html>
